<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" media="all">
</head>
<body>
    <div class="layui-container" style="width: 700px;height: 600px;margin-top: 0px;padding-top: 60px">
        <div style="mar-left: 460px;width: 200px;">
            Welcome Back! <a href="/account/redirect/order" th:text="${session?.user?.nickname}"></a>
            <a href="/account/logout">&nbsp;&nbsp;&nbsp;&nbsp;
                <button class="layui-btn layui-btn-warm layui-btn-radius">退出</button>
            </a>
        </div>
        <table class="layui-hide" id="test" lay-filter="test"></table>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-xs" lay-event="order">订购</a>
        </script>
        <script th:src="@{/layui/layui.js}" charset="utf-8"></script>
        <script>
            layui.use('table', function(){
                var table = layui.table;

                table.render({
                    elem: '#test'
                    ,url:'/client/findAll/'
                    // ,url:'/menu/findAll'
                    ,title: '菜单列表'
                    ,cols: [
                        [
                            {field:'id', width:100, title: '编号', sort: true}
                            ,{field:'name', width:200, title: '菜品'}
                            ,{field:'price', width:100, title: '单价'}
                            ,{field:'flavor', width:100, title: '口味'}
                            ,{field:'tid',width:100,  title: '分类',templet:function(data){
                                    return data.type.name
                                }
                            }
                            ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:70}
                        ]
                    ]
                    ,page: true
                });

                //监听行工具事件
                table.on('tool(test)', function(obj){
                    var data = obj.data;
                    if(obj.event === 'order'){
                        window.location.href="/order/save/"+data.id;
                    }
                });
            });
        </script>
    </div>
    <script>
        //二级菜单联动
        layui.use('element', function(){
            var element = layui.element;

        });
    </script>
</body>
</html>